/**
 * 学段选择组件
 */

import React from 'react';
import Group from './Group.jsx';

import Checkbox from 'material-ui/lib/checkbox';

import filterStyle from './Filter.less';

export default class StageGroup extends React.Component {
	static propTypes = {
		stages: React.PropTypes.array,
	};

	static defaultProps = {
		stages: [],
		checkedItems: [],
		onItemCheck: function() { }
	};

	constructor(props) {
		super(props);

		this.handleCheck = this.handleCheck.bind(this);
	}

	// 处理选择状态变化
	handleCheck(event, isChecked) {
		let { onItemCheck } = this.props;
		onItemCheck('stage', event.target.value, isChecked);
	};

	render() {
		let { stages, checkedItems } = this.props;

		return (
			<Group name='学段'>
				<div className={filterStyle.inline}>
					<Checkbox 
						key={-1} 
						value={'-1'} 
						checked={checkedItems.includes('-1')}
						onCheck={this.handleCheck}
						label='不限'
						className={filterStyle.checkbox} />
					{
						stages.map((item, index) => 
							<Checkbox 
								key={index} 
								value={item.enum} 
								checked={checkedItems.includes(item.enum)}
								onCheck={this.handleCheck}
								label={item.name}
								className={filterStyle.checkbox} />)
					}
				</div>
			</Group>
		);
	}
}